<!doctype html>
<html lang="zh-cmn-Hans" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no"/>
    <meta name="renderer" content="webkit"/>
    <meta name="force-rendering" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
          crossorigin="anonymous">

    <!-- MDUI CSS -->
    <link
            rel="stylesheet"
            href="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/css/mdui.min.css"
            integrity="sha384-cLRrMq39HOZdvE0j6yBojO4+1PrHfB7a9l5qLcmRm/fiWXYY+CndJPmyu5FV/9Tw"
            crossorigin="anonymous"
    >
    <title>新冠疫情</title>
</head>
<body>
<div class="mdui-table-fluid">
    <h1 th:align="center" th:text="(${country}==null?'全球':${country})+'新冠病毒实时数据统计'"></h1>

    <div class="jumbotron">
        <p class="lead" th:text="'截至今天'+(${country}==null?'全球':${country})+'新冠肺炎确诊病例数'"></p>
        <h1 class="display-3" th:align="center" th:text="${totalReportedCases}"></h1>

        <hr class="my-4">
        <p>
            <span th:text="'较前一日新增'+(${country}==null?'全球':${country})+'新冠肺炎确诊病例数:'"></span>
            <span th:text="${totalNewCases}"></span>
        </p>
    </div>

    <table class="mdui-table mdui-table-hoverable">
        <thead>
        <tr bgcolor="00bec7">
            <th>省/州</th>
            <th>国家/地区</th>
            <th>确诊病例总数</th>
            <th>较前一日新增病例数</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="Stats:${stats}">
            <td th:text="${Stats.state}"></td>
            <td th:text="${Stats.country}"></td>
            <td th:text="${Stats.latestTotalCases}"></td>
            <td th:text="${Stats.diffFromPrevDay}"></td>
        </tr>
        </tbody>
    </table>
</div>
<!-- MDUI JavaScript -->
<script
        src="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/js/mdui.min.js"
        integrity="sha384-gCMZcshYKOGRX9r6wbDrvF+TcCCswSHFucUzUPwka+Gr+uHgjlYvkABr95TCOz3A"
        crossorigin="anonymous"
></script>
</body>
</html>